<template>
	<view class="collect">
		<view class="list" v-if="list.length">
			<navigator class="item" v-for="item in list" :key="item.id" :url="'/pages/find/articleDetail/articleDetail?id=' + item.id">
				<image :src="item.coverImg" mode=""></image>
				<view class="title">{{ item.title }}</view>
			</navigator>
		</view>
		<empty v-else></empty>
	</view>
</template>

<script>
export default {
	data() {
		return {
			list: [] // 收藏列表
		};
	},
	methods: {
		getCollectList() {
			const list = uni.getStorageSync('articleList');
			if (list) {
				this.list = list;
			}
		}
	},
	onLoad() {
		this.getCollectList();
	}
};
</script>

<style lang="scss" scoped>
.collect {
	overflow: hidden;
	.list {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		margin: 30rpx;
		.item {
			width: 334rpx;
			background-color: #fff;
			border-radius: 8rpx;
			margin-bottom: 40rpx;
			overflow: hidden;
			image {
				width: 100%;
				height: 238rpx;
			}
			.title {
				font-size: 24rpx;
				text-align: center;
				margin: 20rpx 0;
			}
		}
	}
}
</style>
